import React, { lazy } from 'react'
import { Navigate, Routes, Route } from 'react-router-dom'
import Home from '@/pages/home'
import { WithAuthElement, NoAuthElement } from './auth'
import {
  SettingOutlined,
  DashboardOutlined,
  InteractionOutlined,
  AppstoreOutlined,
  UnorderedListOutlined,
  ProjectOutlined
} from '@ant-design/icons'
//路由配置
export const RouterConfig = [
  {
    path: '/',
    element: <Home />,
    children: [
      {
        path: '/',
        element: <Navigate to={'/dashboard/analysis'} replace={true} />,
      },
      {
        path: '/dashboard',
        meta: {
          label: 'menu.dashboard.root',
          icon: <DashboardOutlined />,
        },
        children: [
          {
            path: '/dashboard/analysis',
            element: WithAuthElement(lazy(() => import('@/pages/dashboard/analysis'))),
            meta: {
              label: 'menu.dashboard.analysis',
              access: '001.001',
            },
          },
        ],
      },
      {
        path:'/detail',
        element: WithAuthElement(lazy(() => import('@/pages/detail'))),
        meta: {
          label: 'menu.detail.root',
          icon:<ProjectOutlined />,
          hideInMenu:true
        }
      },
      {
        path: '/sundry',
        meta: {
          label: 'menu.sundry.root',
          icon: <InteractionOutlined />,
        },
        children: [
          {
            path: '/sundry/router',
            element: WithAuthElement(lazy(() => import('@/pages/sundry/flattenRouter'))),
            meta: {
              label: 'menu.sundry.flattenRouter',
              access: '003.002',
              flatten: true,
            },
            children: [{
              path: '/sundry/router/detail/:id',
              element: WithAuthElement(lazy(() => import('@/pages/sundry/flattenRouter/detail'))),
              meta: {
                label: 'detail',
                hideInMenu: true,
                access: '003.002.001',
              },
            }],
          },
        ],
      },
    ],
  },
  {
    path: '/login',
    element: NoAuthElement(lazy(() => import('../pages/system/login'))),
  },
  {
    path: '/403',
    element: NoAuthElement(lazy(() => import('@/router/403'))),
  },
  {
    path: '/*',
    element: NoAuthElement(lazy(() => import('@/router/404'))),
  },
]
//创建路由
const Routers = () => {
  const create = (routerArray, parentPath = '0') => {
    return routerArray.map((router, index) => {
      const currentPath = `${parentPath}_${index}`
      const { path, element, children = [], meta = {} } = router
      const { flatten } = meta
      if (flatten) {
        return <React.Fragment key={currentPath}>
          <Route path={path} element={element} />
          {create(children, currentPath)}
        </React.Fragment>
      }
      return <Route key={currentPath} path={path}
                    element={element}>{create(children, currentPath)}</Route>
    })
  }
  return <Routes>
    {
      create(RouterConfig)
    }
  </Routes>
}
export default Routers
